<template>
	<view>
		<view class="setting">
			<u-toast ref="errInfo" />
			<div class="outer">
				<div class="mytext inner">温度上限：{{temperatureMax}}</div>
				<u-slider v-model="positiveMax" block-width="30" block-color="#fa3534" :step="1" active-color="#fa3534"
					:height="10" @end="updateTempMax"></u-slider>
			</div>
			<div class="outer">
				<div class="mytext inner">温度下限：{{temperatureMin}}</div>
				<u-slider v-model="positiveMin" block-width="30" block-color="#fcbd71" :step="1" active-color="#fcbd71"
					:height="10" @end="updateTempMin"></u-slider>
			</div>
			<div class="outer">
				<div class="mytext inner">湿度上限：{{humidityMax}}</div>
				<u-slider v-model="humidityMax" block-width="30" block-color="#2979ff" :step="1" active-color="#2979ff"
					:height="10" @end="updateHumiMax"></u-slider>
			</div>
			<div class="outer">
				<div class="mytext inner">湿度下限：{{humidityMin}}</div>
				<u-slider v-model="humidityMin" block-width="30" block-color="#a0cfff" :step="1" active-color="#a0cfff"
					:height="10" @end="updateHumiMin"></u-slider>
			</div>
			<div class="mid">
				<div class="outterdiv">
					<image class="myImage" src="/static/fire.png"></image>
					<div class="innerdiv">
						<div class="mytext">灭火装置控制: {{fireCheck?"开启":"关闭"}}</div>
						<u-switch v-model="fireCheck" @change="changeFireStatus"></u-switch>
					</div>
				</div>
				<div class="outterdiv">
					<image class="myImage" src="/static/adjust.png"></image>
					<div class="innerdiv">
						<div class="mytext">环境温湿度调节器控制: {{adjustCheck?"开启":"关闭"}}</div>
						<u-switch v-model="adjustCheck" @change="changeAdjustStatus"></u-switch>
					</div>

				</div>
			</div>
		</view>
		<Common></Common>
	</view>
</template>

<script>
	import Common from "../../components/Common.vue"
	export default {

		created() {
			//获取初始的阈值
			let deviceId
			try {
				deviceId = uni.getStorageSync('deviceId');
			} catch (e) {
				// error
				console.log(e.message)
			}
			deviceId = parseInt(deviceId, 10)
			//请求阈值信息
			uni.request({
				url: `${this.$store.state.ipAddr}/getThreshold`, //仅为示例，并非真实接口地址。
				data: {
					deviceId: deviceId
				},
				success: (res) => {
					let data = res.data.data
					this.humidityMax = Math.floor(data.humiH);
					this.humidityMin = Math.ceil(data.humiL);
					this.positiveMax = Math.floor((data.tempH / 2) + 50);
					this.positiveMin = Math.ceil((data.tempL / 2) + 50);
					this.fireCheck = data.fire == 0 ? false : true;
					this.adjustCheck = data.adjust == 0 ? false : true;
				}
			});


		},
		components: {
			Common
		},
		data() {
			return {
				positiveMax: 0,
				positiveMin: 0,
				humidityMax: 0,
				humidityMin: 0,
				fireCheck: false,
				adjustCheck: false

			}
		},
		computed: {
			temperatureMax() {
				return (this.positiveMax - 50) * 2;
			},
			temperatureMin() {
				return (this.positiveMin - 50) * 2;
			},
		},
		methods: {
			async updateTempSetting() {
				// 获取初始的阈值
				let deviceId;
				try {
					deviceId = uni.getStorageSync('deviceId');
				} catch (e) {
					// error
					console.log(e.message);
				}
				deviceId = parseInt(deviceId, 10);

				let h = false;
				let l = false;

				// 修改温度上限阈值信息
				try {
					let res = await uni.request({
						url: `${this.$store.state.ipAddr}/updateTempH`,
						data: {
							deviceId: deviceId,
							tempH: this.temperatureMax
						}
					});

					let data = res.data;
					if (data.code == 200) {
						h = true;
					}
				} catch (error) {
					console.error("更新 tempH 时发生错误:", error);
				}

				// 修改温度下限阈值信息
				try {
					let res = await uni.request({
						url: `${this.$store.state.ipAddr}/updateTempL`,
						data: {
							deviceId: deviceId,
							tempL: this.temperatureMin
						}
					});

					let data = res.data;
					if (data.code == 200) {
						l = true;
					}
				} catch (error) {
					console.error("更新 tempL 时发生错误:", error);
				}

				if (l && h) {
					this.$refs.errInfo.show({
						title: '修改成功！',
						type: 'success'
					});
				} else {
					this.$refs.errInfo.show({
						title: '修改失败！',
						type: 'error'
					});
				}
			},
			async updateHumiSetting() {
				// 获取初始的阈值
				let deviceId;
				try {
					deviceId = uni.getStorageSync('deviceId');
				} catch (e) {
					// error
					console.log(e.message);
				}
				deviceId = parseInt(deviceId, 10);

				let h = false;
				let l = false;

				// 修改湿度上限阈值信息
				try {
					let res = await uni.request({
						url: `${this.$store.state.ipAddr}/updateHumiH`,
						data: {
							deviceId: deviceId,
							humiH: this.humidityMax
						}
					});

					let data = res.data;
					if (data.code == 200) {
						h = true;
					}
				} catch (error) {
					console.error("更新 humiH 时发生错误:", error);
				}

				// 修改湿度下限阈值信息
				try {
					let res = await uni.request({
						url: `${this.$store.state.ipAddr}/updateHumiL`,
						data: {
							deviceId: deviceId,
							humiL: this.humidityMin
						}
					});

					let data = res.data;
					if (data.code == 200) {
						l = true;
					}
				} catch (error) {
					console.error("更新 humiL 时发生错误:", error);
				}

				if (l && h) {
					this.$refs.errInfo.show({
						title: '修改成功！',
						type: 'success'
					});
				} else {
					this.$refs.errInfo.show({
						title: '修改失败！',
						type: 'error'
					});
				}
			},
			updateTempMax() {
				if (this.positiveMax < this.positiveMin) {
					this.$refs.errInfo.show({
						title: '温度上限不能低于温度下限',
						type: 'error'
					})
				} else {
					this.updateTempSetting()
				}
			},
			updateTempMin() {
				if (this.positiveMax < this.positiveMin) {
					this.$refs.errInfo.show({
						title: '温度下限不能高于温度下限',
						type: 'error'
					})
				} else {
					this.updateTempSetting()
				}
			},
			updateHumiMax() {
				if (this.humidityMax < this.humidityMin) {
					this.$refs.errInfo.show({
						title: '湿度上限不能低于湿度下限',
						type: 'error'
					})
				} else {
					this.updateHumiSetting()
				}
			},
			updateHumiMin() {
				if (this.humidityMax < this.humidityMin) {
					this.$refs.errInfo.show({
						title: '湿度下限不能高于湿度上限',
						type: 'error'
					})
				} else {
					this.updateHumiSetting()
				}
			},
			changeFireStatus() {
				console.log("changeFireStatus")
				//获取初始的阈值
				let deviceId
				try {
					deviceId = uni.getStorageSync('deviceId');
				} catch (e) {
					// error
					console.log(e.message)
				}
				deviceId = parseInt(deviceId, 10)

				//请求修改调节器控制
				uni.request({
					url: `${this.$store.state.ipAddr}/fire`, //仅为示例，并非真实接口地址。
					data: {
						deviceId: deviceId,
						fire: this.fireCheck ? 1 : 0
					},
					success: (res) => {
						let data = res.data
						if (data.code == 200) {
							this.$refs.errInfo.show({
								title: '修改成功！',
								type: 'success'
							})
						} else {
							this.$refs.errInfo.show({
								title: '修改失败！',
								type: 'error'
							})
						}
					}
				});
			},
			changeAdjustStatus() {
				//获取初始的阈值
				let deviceId
				try {
					deviceId = uni.getStorageSync('deviceId');
				} catch (e) {
					// error
					console.log(e.message)
				}
				deviceId = parseInt(deviceId, 10)

				//请求修改调节器控制
				uni.request({
					url: `${this.$store.state.ipAddr}/adjust`, //仅为示例，并非真实接口地址。
					data: {
						deviceId: deviceId,
						adjust: this.adjustCheck ? 1 : 0
					},
					success: (res) => {
						let data = res.data
						if (data.code == 200) {
							this.$refs.errInfo.show({
								title: '修改成功！',
								type: 'success'
							})
						} else {
							this.$refs.errInfo.show({
								title: '修改失败！',
								type: 'error'
							})
						}
					}
				});
			},
		}
	}
</script>

<style scoped>
	.setting {
		width: 100%;
		height: 480px;
	}

	.mytext {
		margin-right: 20rpx;
		font-weight: 300;
		font-family: Arial, sans-serif;
	}

	.outer {
		margin-top: 40rpx;
		margin-bottom: 40rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;

	}

	.mySet {
		margin-top: 40rpx;
		margin-bottom: 40rpx;
		margin-left: 30rpx;
		margin-right: 30rpx;
		display: flex;
		/* 垂直居中对齐 */
		align-items: center;

	}

	.inner {
		margin-bottom: 10rpx;
	}

	image {
		width: 100rpx;
		height: 100rpx;
		margin-right: 50rpx;
	}

	.mid {

		margin-left: 35rpx;
		padding-top: 10rpx;
		/* 	display: flex; */
		justify-content: space-between;
	}

	.mid>div {
		flex: 1;
		display: flex;
		align-items: center;
	}

	.myImage {
		height: 128rpx;
		width: 128rpx;
		position: relative;
	}

	.innerdiv {
		padding-top: 10rpx;
	}

	.outterdiv {
		margin-top: 30rpx;
	}
</style>